import EventBus from "@/utils/EventBus";
import axios from "axios";

const request = axios.create({
    // 通常这个 baseURL 有这么几种情况：
    // 1. 打包后的资源所在的服务器 是 和接口服务器 是同一台服务器
    //          baseURL - 1. 直接写接口服务器  ，2. 直接写 /
    // 2. 打包后的资源所在的服务器 是 和接口服务器 不是同一台服务器
    //      也分两种情况
    //          2.1 接口服务器已经处理好了 跨域问题 - 此时我们只需要 把baseURL 直接写成接口服务器
    //          2.2 后端的接口服务器没有处理跨域 - 必须让后端进行代理(nginx之类的东西) ， 这里使用 http-proxy-middlewaver 来代替
    //                 - baseURL 还是以 一个 指定的 开头 - 需要和后端沟通好
    baseURL: "/api",
    // 当然，这个baseurl一般不在这写死， 我们使用  .env 文件定义  然后使用环境变量来实现  
    // baseURL: "https://www.ahsj.link/rambo",
    timeout: 5000,


    // 如果是 服务器访问地址 不是 根目录的情况
    // 类似： https://52coding.cc/yuantiku/login   /login 才是我们自己写的路由
    // 1. 需要把 index.html 里面的路径  /开头的， 都要 修改为  ./ - 可做也可以不做
    // 2. (cra创建的项目)在package.json 里面添加 homepage 修改 为 你 服务器上 二级目录
    // 但是如果使用的history模式，还是需要后端进行 请求的路由的转发 ，不然容易 404
});

request.interceptors.request.use(
    (config) => {
        let token = localStorage.getItem('token')
        if (token) {
            // if(config.headers)
            config.headers = config.headers || {}
            config.headers["x-auth-token"] = token;
        }
        return config;
    },
    (err) => Promise.reject(err)
);
/*
    统一的请求错误捕获
        use的第一个参数里面写 - 请求是200的，但是可能业务是失败的
        use的第二个参数里面写 - 请求不是200 - 当前这个项目，就是这样的
*/
request.interceptors.response.use(
    (res) => {
        return res.data;
    },
    (err) => {
        // 通过判断 err 然后进行统一的错误捕获
        // console.log(err);
        // 提示用户
        // console.log(err.response.data.message);
        // 现在我们想 使用toast 组件，但是这里不能用？ 逻辑解耦 - 订阅发布模式
        EventBus.emit('errCatch', err.response.data);
        return Promise.reject(err)
    }
);

export default request;